<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>

<body>
	<script>
		let tree = [
			{
				id: '1',
				children: [
					{
						id: '1-1',
						children: [
							{
								id: '1-1-1',
								children: [
									{
										id: '1-1-1-1',
										children: [
											{
												id: '1-1-1-1-1',
												children: [
													{
														id: '1-1-1-1-1-1',
														children: [
															{
																id: '1-1-1-1-1-1-1'
															}
														]
													}
												]
											}
										]
									}
								]
							}
						]
					}
				]
			}
		]

		function deep(tree) {
			let queue = [{ node: tree, level: 0 }];
			while (queue.length > 0) {
				let { node, level } = queue.shift()
				for (let child of node.children || []) {
					queue.push({ node: child, level: level + 1 });
				}
			}
			return tree
		}
		function deep1(tree) {
			tree.forEach(item => {
				item.value = item.id
				if (item.children?.length) deep1(item.children)
			})
			return tree
		}
		console.time()
		console.log(deep1(tree))
		console.timeEnd()
		// console.log(deep(tree))
	</script>
</body>

</html>